<template>
  <u-navbar title="工作台" fixed border leftIcon="" leftText=""></u-navbar>
  <view class="page_wrap_container" :style="{ paddingTop: NavBarHeight + 'px', height: windowHeight + 'px' }">
    <view class="swiper_wrap"><u-swiper :list="swiperList" indicator indicatorMode="line" circular
        :height="160"></u-swiper></view>
    <view class="actions_wrap">
      <u-grid :border="false" col="3">
        <u-grid-item v-for="(listItem, listIndex) in list" :key="listIndex" @click="handleGo(listItem)">
          <u-icon :customStyle="{ paddingTop: 20 + 'rpx' }" :name="listItem.name" :size="26" color="#999"></u-icon>
          <text class="grid-text">{{ listItem.title }}</text>
        </u-grid-item>
      </u-grid>
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue'
import banner01 from '@/static/images/home/banner01.jpg'
import banner02 from '@/static/images/home/banner02.jpg'
import banner03 from '@/static/images/home/banner03.jpg'
import { onLoad, onShow } from '@dcloudio/uni-app'
import useScreenSize from "@/hooks/useScreenSize"
const { windowHeight, NavBarHeight, isIphoneX } = useScreenSize()
onShow(() => {
  const token = uni.getStorageSync("token")
  if (!token) {
    uni.navigateTo({ url: "/pages/login/index" })
  }
})
onLoad(() => {
  // 测试
  // uni.navigateTo({ url: '/pages/purchase/process?purchaseOrderCode=PURS22024071900058&status=2' })
  // uni.navigateTo({ url: "/pages/login/index" })
})
const swiperList = ref([banner01, banner02, banner03])
const list = reactive<{ name: string; title: string; url: string }[]>([
  {
    name: 'order',
    title: '采购订单',
    url: '/pages/purchase/index',
  },
])
const handleGo = (listItem: { name: string; title: string; url: string }) => {
  uni.navigateTo({ url: listItem.url })
}
</script>

<style lang="scss" scoped>
.page_wrap_container {
  box-sizing: border-box;
  background-color: #fff;

  .swiper_wrap {
    width: 700rpx;
    margin: 20rpx auto 0;
  }

  .grid-text {
    font-size: 14px;
    color: #909399;
    padding: 10rpx 0 20rpx 0rpx;
    /* #ifndef APP-PLUS */
    box-sizing: border-box;
    /* #endif */
  }

  .actions_wrap {
    width: 700rpx;
    margin: 0 auto;
    background-color: #fff;
    margin-top: 12rpx;
    border-radius: 12rpx;
  }
}
</style>
